Jake Lazaroff shares his experience of creating Waypoint, a local-first web application designed for trip planning, after feeling dissatisfied with existing tools during his travel sabbatical. The planning process for six months of travel proved to be overwhelming, prompting him to develop a solution that better suited his needs. Waypoint is inspired by the trip planning app Embark, created by Ink & Switch, which offers dynamic documents for organizing travel plans. However, since Embark was not publicly available, Lazaroff decided to build his own tool. He emphasizes that Waypoint is not production-ready and was created specifically for his personal use, highlighting its rough edges and lack of features like authentication. The motivation behind Waypoint stemmed from the shortcomings of other tools he tried. Apple Notes felt too basic, while Notion and Google Maps were cumbersome. Wanderlog was overly structured, making it difficult to explore and research. Lazaroff identified three key areas where Waypoint improves upon existing tools: quick data entry, easy comparisons, and the importance of unstructured data alongside structured data. The app features a dual-panel interface with a text editor on one side and a map on the other, allowing users to jot down notes and visualize locations simultaneously. Waypoint's design facilitates quick data entry, enabling users to type location names with an autocomplete feature. Unlike traditional mapping tools, which can be slow and cumbersome for organizing locations, Waypoint allows users to create route lists easily, with the map updating in real-time as they edit. The app also includes a focus mode that highlights the current paragraph, helping users concentrate on specific tasks while maintaining a clear view of their trip. Under the hood, Waypoint is built using SvelteKit, with custom components from the Shoelace library and a rich text editor powered by ProseMirror. The mapping and location search functionalities utilize Stadia Maps and MapLibre GL JS. A key feature of Waypoint is its use of Yjs, a CRDT (Conflict-free Replicated Data Type) library that allows for local data storage and real-time collaboration without relying on a centralized server. This local-first approach ensures that users can work offline and retain ownership of their data. Waypoint also incorporates Y-Sweet, a WebSocket sync backend that facilitates real-time collaboration. This setup allows multiple users to work on the same document simultaneously, with changes syncing seamlessly. Each document is identified by a UUID, enabling easy sharing and access across different devices. Lazaroff addresses the question of what constitutes a local-first application, asserting that if the client holds the canonical copy of the data, it qualifies as local-first. He evaluates Waypoint against several criteria proposed by Ink & Switch, concluding that it meets most of them, with a few exceptions regarding security and privacy. Reflecting on his experience, Lazaroff finds that building a local-first app is feasible with existing tools, and the integration of various libraries made the process smoother than expected. He notes that while text editors are particularly well-suited for local-first applications, challenges remain in integrating frameworks like Svelte with CRDTs. Despite some complexities, he appreciates the simplicity and reliability of the local-first architecture, which allows for offline functionality and straightforward data management. In conclusion, Lazaroff expresses his enjoyment in developing Waypoint and invites others to explore the code on GitHub, sharing his journey into the local-first ecosystem and the lessons learned along the way.
Wednesday, October 2, 2024